import { getSearchLeaderPage } from '@/api' // 根据经纬度搜索提货点
import { pickupStore } from '@/store'
import { createPinia, storeToRefs } from 'pinia'
import { reactive, ref } from 'vue'
import type { LeaderAddressPageSearchParams, LeaderAddressPage, Location, shopInterface } from '@/types'
const pinia = createPinia()

export default () => {
  const pickUpLocationStore = pickupStore(pinia)
  const { selectShop } = pickUpLocationStore // 获取某个地区下的提货点执行函数
  const { currentShop, isCurrentShop } = storeToRefs(pickUpLocationStore)
  //      仓库中的当前提货点      判断当前的提货是否选中烦恼的提货点

  // 定义搜索条件的初始化数据
  const filter = () =>
    reactive<LeaderAddressPageSearchParams>({
      page: 1, // 当前页码
      limit: 5, // 每页记录数
      latitude: 0, // 经度
      longitude: 0, // 纬度
    })

  const reactiveFilter = filter()

  // 定义搜索结果的初始化数据
  const searchResult = () =>
    reactive<LeaderAddressPage>({
      content: [], // 搜索的结果
      totalPages: 0, // 总页数
      first: false, // 是否已经第一页
      last: false, // 是否已经最后
      empty: false, // 是否为空
    })
  // ! 直接使用searchResult不行，因为在后续结果的对象合并中，产生非响应式的数据，所以需要将其转换为ref
  const reactiveSearchResult = ref(searchResult())

  // 搜索提货点
  const getSearchLeader = async ({ latitude: latitude, longitude: longitude }: Location) => {

    // 如果有下拉选择地区或者搜索地区的话，就重置 filter 和 searchResult
    if (latitude !== 0 && longitude !== 0) {
      console.log('进行店铺的数据的条件限制的重置');
      Object.assign(reactiveSearchResult.value, searchResult()) // 这里重置 searchResult 下的所有数据
      Object.assign(reactiveFilter, filter()) // 这里重置 filter 下的所有数据
    }

    // 如果没有传入经纬度，就使用当前的经纬度
    reactiveFilter.latitude = latitude || reactiveFilter.latitude
    reactiveFilter.longitude = longitude || reactiveFilter.longitude

    console.log('第四步');
    console.log('经度====', reactiveFilter.longitude);
    console.log('纬度====', reactiveFilter.latitude);

    // 发送请求
    const o: LeaderAddressPageSearchParams = {
      limit: reactiveFilter.limit, // 每页记录数
      page: reactiveFilter.page, // 当前页码
      longitude: reactiveFilter.longitude, // 经度
      latitude: reactiveFilter.latitude, // 纬度
    }

    const result = await getSearchLeaderPage(o)
    const res = result.data

    console.log('获取后端的数据res====', res);
    
    // 将结果合并到 reactiveSearchResult，这里需要注意的是，reactiveSearchResult 前面已经转换为 ref，
    //所以需要使用 reactiveSearchResult.value进行赋值，并且它是响应式的，
    //否则的话，不使用ref模式，因为解构赋值，会产生非响应式的数据

    reactiveSearchResult.value = {
      ...res,
      content: [...reactiveSearchResult.value.content, ...res.content],
    }
  }
  // 加载更多
  const loadMore = () => {
    // 如果已经是最后一页了，就不再加载
    if (reactiveSearchResult.value.last) return
    // 如果不是最后一页，就加载下一页
    reactiveFilter.page++
    // 发送请求
    getSearchLeader({ latitude: 0, longitude: 0 })
  }
  // 选择提货点
  const selectLeaderAddress = (leaderId: number) => {
    // 发送到仓库里修改
    selectShop(leaderId)
    // 将当前leaderId的提货点设置为当前提货点
    currentShop.value = reactiveSearchResult.value.content.find((item) => item.leaderId === leaderId) as shopInterface
  }
  return {
    reactiveFilter, // 定义搜索条件响应式--响应式数据
    reactiveSearchResult, //  定义搜索结果的初始化数据--响应式数据
    getSearchLeader, // 搜索提货点
    loadMore, // 上拉加载获取更多
    selectLeaderAddress, //  选择提货点
    currentShop, // 当前提货点
    isCurrentShop, // 判断是否为当前提货点
  }
}
